/* freepost
 * http://freepo.st
 *
 * Copyright © 2014-2015 zPlus
 * 
 * This file is part of freepost.
 * freepost is free software: you can redistribute it and/or modify
 * it under the terms of the GNU Affero General Public License as
 * published by the Free Software Foundation, either version 3 of the
 * License, or (at your option) any later version.
 * 
 * freepost is distributed in the hope that it will be useful,
 * but WITHOUT ANY WARRANTY; without even the implied warranty of
 * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
 * GNU Affero General Public License for more details.
 * 
 * You should have received a copy of the GNU Affero General Public License
 * along with freepost. If not, see <http://www.gnu.org/licenses/>.
 */

div.home {
    background-color: #f5f8fa;
    min-height: 100%;
}

    div.home > .header {
        background-color: #fff;
        border-bottom: 2px solid #e1e8ed;
        margin: 0 0 1em 0;
        overflow: hidden;
        padding: 1em 2em;
    }
        
        div.home > .header .title {
            display: inline-block;
            font-size: 32px;
            font-weight: bold;
            letter-spacing: .2em;
        }
    
        div.home > .header img {
            vertical-align: middle;
            margin: 0 2em 0 0;
        }
        
        div.home > .header > .signin {
            float: right;
            line-height: 48px;
        }
        
    div.home > .cards {
        display: -webkit-box;
        display: -moz-box;
        display: -ms-flexbox;
        display: -webkit-flex;
        display: flex;
        -webkit-box-direction: normal;
        -moz-box-direction: normal;
        -webkit-box-orient: horizontal;
        -moz-box-orient: horizontal;
        -webkit-flex-direction: row;
        -ms-flex-direction: row;
        flex-direction: row;
        -webkit-flex-wrap: wrap;
        -ms-flex-wrap: wrap;
        flex-wrap: wrap;
        -webkit-box-pack: center;
        -moz-box-pack: center;
        -webkit-justify-content: space-around;
        -ms-flex-pack: center;
        justify-content: space-around;
        -webkit-align-content: center;
        -ms-flex-line-pack: center;
        align-content: center;
        -webkit-box-align: center;
        -moz-box-align: center;
        -webkit-align-items: center;
        -ms-flex-align: center;
        align-items: center;
    }
    
    div.home > .signin {
        margin: auto;
        overflow: hidden;
        width: 50%;
    }
    
        div.home > .signin > .menu {
            float: left;
            list-style: none;
            margin: 0;
            overflow: hidden;
            padding: 1em 0;
            width: 30%;
        }
        
            div.home > .signin > .menu > li {
                cursor: pointer;
                padding: 1em 2em 1em 1em;
                margin: 0 0 1px 0;
                transition: all .5s;
            }
            
            div.home > .signin > .menu > li:hover,
            div.home > .signin > .menu > li.selected {
                background-color: #FFAC4D;
                color: #fff;
            }
        
        div.home > .signin > .form {
            border-left: 1px solid #FFAC4D;
            margin: 0 0 0 30%;
            padding: 1em 1em 1em 2em;
        }
            
            div.home > .signin > .form > div {
                display: none;
            }
            
            div.home > .signin > .form > div.selected {
                display: block;
            }
            
            div.home > .signin > .form .title {
                font-weight: bold;
                margin: 1em 0;
            }
            
            div.home > .signin > .form .buttons {
                margin: 1em 0 0 0;
            }
            
            div.home > .signin > .form .tip {
                color: #888;
                font-size: .8em;
                line-height: 2em;
            }
            
            div.home > .signin > .form .validUsername {
                color: #1EC900;
                display: none;
                line-height: 1.5em;
            }
            
            div.home > .signin > .form .badUsername {
                color: #EB1C1C;
                display: none;
                line-height: 1.5em;
            }
            
            div.home > .signin > .form #rememberme
                        {
                margin: 0 0 0 2em;
            }
            
    div.home .community {
        cursor: pointer;
        margin: 1em;
        padding: 0;
    }
    
        div.home .community > .picture {
            height: 256px;
            width: 256px;
        }
        
        div.home .community > .name {
            font-size: 1.5em;
            padding: .5em;
        }

        
        
        
        
        
        
        
        
        